import { View, Image, Text } from '@tarojs/components'

import './index.less'

interface CardProps {
  title: string
  author: string
  rating: string
  imageUrl: string
  mode?: string
  onClick?: (item?: any) => void
  item?: any
}

const Card = (props: CardProps) => {
  const { title, author, rating, imageUrl, mode = 'card', item, onClick } = props

  return (
    <View className='card' onClick={() => onClick?.(item)}>
      <View className='cardImageBlock'>
        <Image
          className={mode == 'card' ? 'cardContentImage' : 'cardImage'}
          src={item.imageUrl}
        ></Image>
      </View>
      <View className='cardContent'>
        <Text className='cardTips'>推荐值 {rating}</Text>

        <View className='cardText'>{item.name} </View>
        <View className='cardAtuor'> {item.author} </View>
      </View>
    </View>
  )
}

export default Card
